import Vue from 'vue'
import moment from 'moment'
import store from '@/store'
const directiveObj = {
  // 需求：你有图片用你的，你图片没有，优先用我传入的，我没有传用默认的  ，你加载出错，用我传入的或者是默认的
  errorimg: {
    inserted(dom, obj) {
      dom.src = dom.src || obj.value || require('@/assets/common/head.jpg')
      dom.onerror = () => {
        dom.src = obj.value || require('@/assets/common/head.jpg')
      }
    },
    componentUpdated(dom, obj) {
      dom.src = dom.src || obj.value || require('@/assets/common/head.jpg')
    }
  },
  xxx: {},
  ooo: {},
  time: {
    // bind,inserted,update,componentUpdated,unbind
    // inserted(dom,obj,vnode){
    //   dom:指令所在dom
    //   obj:{
    //     属性,修饰符,值(value)
    //   }
    //   vnode:{
    //     context:指令所在组件的this
    //   }
    // }
    inserted(dom, obj) {
      dom.innerText = moment(obj.value).format('YYYY-MM-DD')
    },
    componentUpdated(dom, obj) {
      dom.innerText = moment(obj.value).format('YYYY-MM-DD')
    }
  },
  // 按钮权限控制
  showButton: {
    inserted(dom, obj) {
      if (!store.state.user.userInfo.roles.points.includes(obj.value)) {
        dom.style.display = 'none'
      }
    },
    componentUpdated(dom, obj) {
      if (!store.state.user.userInfo.roles.points.includes(obj.value)) {
        dom.style.display = 'none'
      }
    }
  }
}
// 对象循环怎么做？
//   for  in
// for (const key in directiveObj) {
//   Vue.directive(key, directiveObj[key])
// }
// 对象转换成数组
//  Object.keys(对象)   ['errorimg','xxx','ooo']
// Object.values(对象)  [{....},{},{}]
// Object.entries(对象) [['errorimg',{..}],['xxx',{}],['ooo',{}]]
// Object.keys(directiveObj).forEach((item) => {
//   Vue.directive(item, directiveObj[item])
// })

Object.entries(directiveObj).forEach((item) => {
  Vue.directive(item[0], item[1])
})
